<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="bs/css/bootstrap.css">
    <link rel="stylesheet" href="layui/css/layui.css">
    <script src="layui/layui.js"></script>
</head>
<body>
<!--<!DOCTYPE html>-->
<!--<html>-->


<style>
    .layui-btn {
        padding: 0 7px !important;
        font-size: 2px !important;
    }
    .layui-form-label{
        width: 100px !important;
    }
</style>
<div style="margin-top: 1%;">
    <form class="layui-form" action="">

        <div class="layui-form-item  layui-col-xs12">
            <div class="layui-inline ">
                <label class="layui-form-label">IP地址:</label>
                <div class="layui-input-inline">
                    <input type="tel"  name="IP"  autocomplete="off" class="layui-input">
                </div>
            </div>
        </div>

        <div class="layui-form-item layui-col-xs12">
            <div class="layui-inline layui-col-xs12">
                <label class="layui-form-label">MAC地址:</label>
                <div class="layui-input-inline">
                    <input type="text"  name="Mac" autocomplete="off" class="layui-input">
                </div>
            </div>
        </div>

        <div class="layui-form-item layui-col-xs12">
            <div class="layui-inline layui-col-xs12">
                <label class="layui-form-label">房间号:</label>
                <div class="layui-input-inline">
                    <input type="text"  name="room" autocomplete="off" class="layui-input">
                </div>
            </div>
        </div>

        <div class="layui-form-item layui-col-xs12">
            <div class="layui-inline">
                <label class="layui-form-label">所属分组:</label>
                <div class="layui-input-inline">
                    <select name="type">
                        <option value="0">急急急</option>
                    </select>
                </div>
            </div>
        </div>
        <div class="layui-form-item layui-col-xs12" style="margin: 0 5%;">
            <button type="submit" class="layui-btn" lay-filter="demo1" >修改</button>
            <button  class="layui-btn"  >取消</button>
        </div>
    </form>
</div>






</body>



<script>
    layui.use(['form', 'layedit', 'laydate'], function(){
        var form = layui.form
            ,layer = layui.layer
            ,layedit = layui.layedit
            ,laydate = layui.laydate;
        form.render();



        //表单赋值
        layui.$('#LAY-component-form-setval').on('click', function(){
            form.val('example', {
                "username": "贤心" // "name": "value"
                ,"password": "123456"
                ,"interest": 1
                ,"like[write]": true //复选框选中状态
                ,"close": true //开关状态
                ,"sex": "女"
                ,"desc": "我爱 layui"
            });
        });

        //表单取值
        layui.$('#LAY-component-form-getval').on('click', function(){
            var data = form.val('example');
            alert(JSON.stringify(data));
        });

    });
</script>

</html>